<template>
  <div class="app">
    <v-nav v-if="nav" :title="title" />
    <router-view class="page" />
    <v-loading v-if="loading" :mask="true" />
  </div>
</template>

<script>
export default {
  name: "App",
  data: () => ({
    nav: false,
    title:'',
    loading:false
  }),
  watch: {
    $route(to, from) {
      document.title = to.meta.title;
      this.title = to.meta.title;
      this.nav = to.meta.nav;
    },
  },
  ounted() {
    let _this = this;
    this.$bus.$on("loading", () => {
      _this.loading = true;
    });
    this.$bus.$on("hideloading", () => {
      _this.loading = false;
    });
  },
};
</script>

<style lang="scss" scoped>
.app {
  min-height: calc(100vh);
  background: #eee;
}
.page {
  min-height: calc(100vh);
}
.fixed{
  padding-top: 0.88rem;
}
</style>
